<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:p="http://primefaces.org/ui"
	xmlns:ui="http://java.sun.com/jsf/facelets">
<h:head>
</h:head>
<f:event listener="#{systemNavigatePage.userSupportRole}"
	type="preRenderView"></f:event>
<body>
	<div id="content-outer">
		<div id="content">

			<!--  start page-heading -->
			<div id="page-heading">
				<h1>Record Login Management</h1>
			</div>
			<!-- end page-heading -->
			<table border="0" width="100%" cellpadding="0" cellspacing="0"
				id="content-table">
				<tr>
					<th rowspan="3" class="sized"><img
						src="images/shared/side_shadowleft.jpg" width="20" height="300"
						alt="" /></th>
					<th class="topleft"></th>
					<td id="tbl-border-top">&nbsp;</td>
					<th class="topright"></th>
					<th rowspan="3" class="sized"><img
						src="images/shared/side_shadowright.jpg" width="20" height="300"
						alt="" /></th>
				</tr>
				<tr>
					<td id="tbl-border-left"></td>
					<td>
						<!--  start content-table-inner ...................................................................... START -->
						<div id="content-table-inner">

							<!--  start table-content  -->
							<div id="table-content">

								<!--  start message-green -->
								<!--  start top-search -->
								<div id="top-search">
									<h:form>
										<table border="0" cellpadding="0" cellspacing="0">
											<tr>
												<td colspan="3">From <p:calendar id="fromDate"
														value="#{systemRecordLoginManageBean.fromDate}"
														mode="popup" pattern="d/M/yyyy">
													</p:calendar> To <p:calendar id="toDate"
														value="#{systemRecordLoginManageBean.toDate}" mode="popup"
														pattern="d/M/yyyy">

													</p:calendar>
												</td>
											</tr>

											<tr>
												<th>System User ID</th>
												<td><h:inputText
														value="#{systemRecordLoginManageBean.searchValue}"
														styleClass="top-search-inp" /></td>
												<td><h:commandButton value="Search"
														action="#{systemRecordLoginManageBean.search()}"
														image="images/shared/top_search_btn.gif"
														styleClass="search-btn" /></td>
											</tr>
										</table>
									</h:form>
								</div>
								<!--  end top-search -->

								<!-- Start table -->
								<h:form id="mainform">
									<!-- Start table -->
									<!--  start list-table ..................................................................................... -->
									<!-- Start table -->
									<p:dataTable width="100%" var="list" paginator="true" rows="15"
										widgetVar="accTable"
										paginatorTemplate="{CurrentPageReport}  {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}"
										rowsPerPageTemplate="10,20,30"
										value="#{systemRecordLoginManageBean.systemRecordListDataModel}">

										<p:column sortBy="#{list.systemUserID}">
											<f:facet name="header">SystemUser ID</f:facet>
											<h:outputText value="&nbsp;#{list.systemUserID}"></h:outputText>
										</p:column>
										<p:column sortBy="#{list.userName}">
											<f:facet name="header">User Name</f:facet>
											<h:outputText value="&nbsp;#{list.userName}"></h:outputText>
										</p:column>
										<p:column sortBy="#{list.firstName}">
											<f:facet name="header">Full Name</f:facet>
											<h:outputText value="#{list.lastName} #{list.midName} #{list.firstName}"></h:outputText>
										</p:column>
										<p:column sortBy="#{list.beginTime}">
											<f:facet name="header">Begin Time</f:facet>
											<h:outputText value="&nbsp;#{list.beginTime}">
												<f:convertDateTime pattern="MM/dd/yyyy HH:mm" />
											</h:outputText>
										</p:column>
										<p:column sortBy="#{list.endTime}">
											<f:facet name="header">End Time</f:facet>
											<h:outputText value="&nbsp;#{list.endTime}">
												<f:convertDateTime pattern="MM/dd/yyyy HH:mm" />
											</h:outputText>
										</p:column>



									</p:dataTable>

									<!--  start list-table ..................................................................................... -->
									<!-- <table style="margin-top: 30px" border="0" width="100%"
										cellpadding="0" cellspacing="0" id="product-table">

										<tr>
											<th class="table-header-repeat line-left" width="15%">&nbsp;System User ID</th>
											<th class="table-header-repeat line-left" width="20%">&nbsp;User Name</th>
											<th class="table-header-repeat line-left" width="25%">&nbsp;Full Name</th>
											<th class="table-header-repeat line-left" width="20%">&nbsp;Begin Time</th>
											<th class="table-header-repeat line-left" width="20%">&nbsp;EndTime</th>
										</tr>
										<tbody>
											<ui:repeat var="list"
												value="#{systemRecordLoginManageBean.systemRecordListDataModel}"
												varStatus="status">
												<tr>
													<td style="text-align: left"><h:outputText
															value="#{list.systemUserID}"></h:outputText></td>
													<td style="text-align: left"><h:outputText
															value="#{list.userName}"></h:outputText></td>
													<td style="text-align: left"><h:outputText
															value="#{list.lastName} #{list.midName} #{list.firstName}"></h:outputText></td>
													<td style="text-align: left"><h:outputText
															value="#{list.beginTime}"></h:outputText></td>
													<td style="text-align: left"><h:outputText
															value="#{list.endTime}"></h:outputText>
													</td>

												</tr>
											</ui:repeat>
										</tbody>
									</table> -->
									<!--  end table................................... -->
								</h:form>
							</div>
							<!--  end content-table  -->

							<div class="clear"></div>

						</div> <!--  end content-table-inner ............................................END  -->
					</td>
					<td id="tbl-border-right"></td>
				</tr>
				<tr>
					<th class="sized bottomleft"></th>
					<td id="tbl-border-bottom">&nbsp;</td>
					<th class="sized bottomright"></th>
				</tr>
			</table>
		</div>
	</div>

</body>
</html>
